import React, { useEffect, useState } from 'react'
import Child from './Child'

export default function App() {
  const [counter, setCounter] = useState(100)
  const [isShow, setIsshow] = useState(100)
  useEffect(() => {
    console.log('类似于componentDidMount，通常在此处调用api获取数据')
  }, [])

  useEffect(() => {
    console.log('相当于执行了 componentDidMounte 和 componentDidUpdate')
  })

  useEffect(() => {
    console.log('指定数据更新之后触发该回调函数')
  }, [counter])
  return (
    <div>
      <h1> 当前计数为：{counter}</h1>
      <button onClick={() => setCounter(counter + 1)}>+</button>
      <br />
      <button onClick={() => setIsshow(!isShow)}>显示隐藏</button>
      {isShow ? <Child></Child> : ''}
    </div>
  )
}
